﻿
@{
    Layout = null;
}
<link href="~/Content/themes/uploadify.css" rel="stylesheet" />
<script src="~/Content/jquery.uploadify.min.js"></script>
<style type="text/css">
    #config_coverUpload-button {
        margin-top: 20px;
        height: 22px;
        line-height: 22px;
        width: 68px;
    }
</style>

<table id="config" class="easyui-datagrid" style="width:100%;height:100%"
       url=""
       title="配置信息" iconcls="icon-save" fitcolumns="true" sortname="CreateTime" sortorder="desc"
       pagination="true"
       idfield="Id"
       fit="true"
       noheader="true"
       striped="true"
       singleselect="true"
       checkonselect="false"
       nowrap="true"
       loadmsg='正在加载……'
       rownumbers="true"
       frozencolumns="[[{ field:'ck'  checkbox:false }]]"
       toolbar="#tbConfig">
    <thead>
        <tr>
            <th field="Id" width="100" align="center" hidden="hidden">序号</th>
            @*<th field="ConfigKey" width="100" align="center" >配置键</th>*@
            <th field="Title" width="100" align="center">标题</th>
            <th field="Content" width="100" align="center">内容</th>
            <th field="Link" width="100" align="center">链接</th>
            <th field="ModifyTime" width="100" align="center" formatter="formatTime">发布时间</th>
        </tr>
    </thead>
</table>
<div id="tbConfig">
    <a href="#" class="easyui-linkbutton" iconcls="icon-add" plain="true" onclick="javascript:AddConfig()">添加</a>
    <a href="#" class="easyui-linkbutton" iconcls="icon-cut" plain="true" onclick="javascript: UpdateConfig()">修改</a>
    <a href="#" class="easyui-linkbutton" iconcls="icon-cancel" plain="true" onclick="javascript:DeleteConfig()">删除</a>
    <select class="easyui-combobox" id="configkey_combo" style="width:200px;"data-options="multiple:false,editable:false">
        <option value="banner" checked>首页Banner</option>
        <option value="scrollx">横屏滚动消息</option>
        <option value="scrolly">竖屏滚动消息</option>
    </select>
</div>

<div id="AddConfig" class="easyui-dialog" title="添加配置信息" style="width:450px;height:auto;padding:20px" buttons="#config-dlg-buttons" data-options="iconCls:'icon-add',resizable:true,modal:true,closed:true">
    <div class="easyui-panel" data-options="fit:true,border:false">
        <form id="addConfigForm" method="post" action="/admin/AddConfig">
            <input type="hidden" name="Id" id="config_Id" />
            <div style="margin-bottom:15px">
                <select class="easyui-combobox" id="config_ConfigKey" name="ConfigKey" label="分类:" data-options="multiple:false,editable: false" labelPosition="top" style="width:80%;">
                    <option value="banner" selected="selected">首页Banner</option>
                    <option value="scrollx">横屏滚动消息</option>
                    <option value="scrolly">竖屏滚动消息</option>
                </select>
            </div>
            <div style="margin-bottom:15px">
                <input class="easyui-textbox" name="Title" id="config_Title" label="标题:" labelPosition="top" style="width:80%;">
            </div>
            <div style="margin-bottom:15px" id="config_d1">
                <input class="easyui-textbox" name="Description" id="config_Description" label="描述:" labelPosition="top" style="width:80%;">
            </div>
            <div style="margin-bottom:15px">
                <input class="easyui-textbox" name="Link" id="config_Link" label="链接:" labelPosition="top" style="width:80%;">
            </div>
            <div style="margin-bottom:15px" id="config_d2">
                <div>
                    <input class="easyui-textbox" name="Content" id="config_Content" label="图片:" labelPosition="top" style="width:80%;">
                    <input type="file" id="config_coverUpload" />
                </div>
                <div class="controls" name="coverImg" id="config_coverImg">
                </div>
            </div>
        </form>
    </div>
</div>
<div id="config-dlg-buttons">
    <table cellpadding="0" cellspacing="0" style="width:100%">
        <tr>
            <td>
                @*<img src="email.gif" />*@
            </td>
            <td style="text-align:right">
                <a href="#" class="easyui-linkbutton" iconcls="icon-save" onclick="javascript:SaveAddConfig()">保存</a>
                <a href="#" class="easyui-linkbutton" iconcls="icon-cancel" onclick="javascript: $('#AddConfig').dialog('close')">取消</a>
            </td>
        </tr>
    </table>
</div>

<script type="text/javascript">

    var config_uploadifyStatus = null;

    $(function () {
        $("#configkey_combo").combobox({
            editable: false,
            onChange: function (newValue, oldValue) {
                $('#config').datagrid('load', {
                    configKey: newValue
                });
                $('#config').datagrid({
                    url: '/Admin/SelectConfig?configKey=' + newValue
                });
                $("#configkey").combobox('setValue', newValue);
            },
            onLoadSuccess: function () {
                var v = $("#configkey_combo").combobox('getValue');
                var option = {
                    url: '/Admin/SelectConfig?configKey=' + v
                }
                $('#config').datagrid(option);
            }
        });
        //$("#config_ConfigKey").combobox({
        //    editable: false,
        //    onChange: function (newValue, oldValue) {
        //        if (newValue == "banner") {
        //            $("#config_d1").css("display", "block");
        //            $("#config_d2").css("display", "block");

        //        } else {
        //            $("#config_d1").css("display", "none");
        //            $("#config_d2").css("display", "none");
        //        }
        //    }
        //});
    })

    function AddConfig() {
        config_clear();
        $("#config_ConfigKey").combobox('setValue', 'banner');
        $("#AddConfig").dialog('open');
        //上传banner图片
        if (config_uploadifyStatus == null) {
            config_renderUploadify();
        }
    }
    function SaveAddConfig() {
        //var v = $("#config_ConfigKey").combobox('getValue');
        //if (v != "banner") {
        //    $("#config_Description").textbox('setValue', '');
        //    $("#config_Content").textbox('setValue', '');
        //}
        $("#addConfigForm").form('submit', {
            success: function (data) {
                data = eval("(" + data + ")");
                if (data.result) {
                    $("#AddConfig").dialog('close');
                    if ($("#config_Id").val() > 0)//ID存在
                    {
                        topCenter("修改配置", "修改成功!");
                    }
                    else {
                        topCenter("添加配置", "添加成功!");
                    }
                    $("#config").datagrid('reload');
                }
                else {
                    if ($("#config_Id").val() > 0)//ID存在
                    {
                        topCenter("修改配置", "修改失败!");
                    }
                    else {
                        topCenter("添加配置", "添加失败!");
                    }
                }
                $('#addConfigForm').form('clear');
            }
        })
    }
    function UpdateConfig() {
        config_clear();
        var row = $("#config").datagrid("getSelected");
        if (row == null) {
            topCenter("提示", "请选择要修改的数据!");
            return;
        }

        //if ($("#config_ConfigKey").combobox('getValue') == "banner") {
        //    $("#config_d1").css("display", "block");
        //    $("#config_d2").css("display", "block");

        //} else {
        //    $("#config_d1").css("display", "none");
        //    $("#config_d2").css("display", "none");
        //}

        $("#config_Id").val(row.Id);
        $("#config_ConfigKey").textbox('setValue', row.ConfigKey);
        $("#config_Title").textbox('setValue', row.Title);
        $("#config_Description").textbox('setValue', row.Description);
        $("#config_Link").textbox('setValue', row.Link);
        $("#config_Content").textbox('setValue', row.Content);
        $("#config_coverImg").html('<img src=' + row.Content + ' alt="" style="margin-bottom:20px" width="200" height="200">');
        $("#AddConfig").dialog({ title: "修改配置" });
        $("#AddConfig").dialog('open');
        //上传封面图片
        if (config_uploadifyStatus == null) {
            config_renderUploadify();
        }
    }
    function DeleteConfig() {
        var row = $("#config").datagrid("getSelected");
        if (row == null) {
            topCenter("提示", "请选择要删除的数据!");
            return;
        }
        $.post('/Admin/DeleteConfig', { configId: row.Id }, function (data) {
            if (data.result) {
                topCenter("提示", "删除成功!");
                $("#config").datagrid('reload');
            } else {
                topCenter("提示", "删除失败!");
            }
        });
    }
    function config_clear() {
        $("#config_Id").val("");
        $("#config_ConfigKey").textbox("setValue", "");
        $("#config_Title").textbox("setValue", "");
        $("#config_Description").textbox('setValue', '');
        $("#config_Link").textbox('setValue', '');
        $("#config_Content").textbox('setValue', '');
        $("#config_coverImg").html("");
    }
    function config_renderUploadify() {
        config_uploadifyStatus = $("#config_coverUpload").uploadify({
            'swf': '/Content/uploadify.swf',
            'buttonText': '上传',
            'uploader': '/data/UploadImg',
            'multi': true,
            'fileTypeDesc': 'Image Files',
            'fileTypeExts': '*.gif; *.jpg; *.png',
            'onUploadSuccess': function (file, data, response) {
                var url = data.replace(/\"/g, "");
                $("#config_Content").textbox('setValue', url);
                $("#config_coverImg").html('<img src=' + data + ' alt="" style="margin-bottom:20px" width="200" height="200">');
            },
            'onUploadError': function (file, errorCode, errorMsg, errorString) {
                alert('图片 ' + file.name + ' 不能上传: ' + errorString);
            }
        });
        // $("#fileUpload-button").removeClass("uploadify-button").addClass("btn blue").css("width", "45px").css("height", "20px").css("line-height", "20px");

    }

</script>
